<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>博客</title>
</head>
<style>
        body{
            display: flex;
            justify-content: center;
            align-items: center;
            height: 600px;
            flex-direction: column;
        }
        table{
            border: 1px solid;
            width: 400px;
            height: 200px;
            display: flex;
            justify-content: center;
            align-items: center;

        }
        #trButton{
            display: flex;
            justify-content: center;
        }
        #btnRegistry{
            margin-left: 50px;
        }
        tr{
            margin-top: 10px;
        }
</style>
<body>
    <table>

        <tr>
            
            <td><label for="">标题：</label></td>
            <td><input type="text" placeholder="请输入标题" name="title"></td>
        </tr>
        <tr>
            <td><label for="">摘要：</label></td>
            <td><input type="text" placeholder="请输入摘要" name="digest"></td>
        </tr>
        <tr>
            <td><label for="">内容：</label></td>
            <td><input type="text" placeholder="请输入内容" name="content"></td>
        </tr>
        <tr>
            <td><label for="">分类：</label></td>
            <td><input type="text" placeholder="请输入类别" name="classification"></td>
        </tr>
        <tr>
            <td><label for="">作者：</label></td>
            <td><input type="text" placeholder="请输入信息" name="writer"></td>
        </tr>
        <tr>
            <td><input type="button" value="保存" onclick="save()"></td>
            <td><input type="button" value="取消" onclick="cancel()"></td>
        </tr>
    </table>
    <script src="./base.js"></script>
    <script src="./api.js"></script>
    <script src="./jquery-3.6.0.min.js"></script>
    <script>
        $(function () {
            let id = getUrlParam('id');
            id = id || 0;
            console.log(id);
            getProductById(id).then(res => {
                console.log(res);
                let obj = res.data;
                $('[name=title]').val(obj.title);
                $('[name=digest]').val(obj.digest);
                $('[name=content]').val(obj.content);
                $('[name=writer]').val(obj.writer);
                $('[name=publishtime]').val(obj.publishtime);
                $('[name=operate]').val(obj.operate);
                $('[name=classification]').val(obj.classification);
            })
        })

        function getUrlParam(name) {

            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); 

            var r = window.location.search.substr(1).match(reg); 

            if (r != null) return unescape(r[2]); return null; 

        }
        function save() {
            let id = getUrlParam('id');
            console.log(id);
            let obj = {
                title: $('[name=title]').val(),
                digest: $('[name=digest]').val(),
                content: $('[name=content]').val(),
                writer: $('[name=writer]').val(),
                publishtime: $('[name=publishtime]').val(),
                operate: $('[name=operate]').val(),
                classification: $('[name=classification]').val(),
            }
            if (id) {
                updateProduct(id, obj).then(res => {
                    console.log(res);
            
                })
            } else {
                let params = {
                    title: obj.title,
                    digest: obj.digest,
                    content: obj.content,
                    writer: obj. writer,
                    publishtime: obj.publishtime,
                    operate: obj.operate,
                    classification: obj.classification
                }
                addProduct(params).then(res => {
     
                })
            }


        }
        function cancel() {

        }
    </script>
</body>

</html>